<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">    
    <title>dataChart</title>    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
	<script type="text/javascript" src="js/highcharts.src.js"></script>
	<script type="text/javascript">
	function getData(type){
			var seriesData=[];
			$.ajax({
					url:"servlet/LookData",
					data:{"type":type},
					type:"POST",
					async:false,
					dataType:"json",
					success:function(data){
						seriesData=data;
					},error:function(xhr,status,t){
						alert(xhr+","+status);
					}
				});
			return seriesData;	
		}
$(function () {
    var chart;
    $(document).ready(function() {
    	var href = window.location.href;		
		var paras = href.substr(href.indexOf('?')).substr(1).split("&");
		var parasObj = {};
		for ( var i = 0; i < paras.length; i++) {
			parasObj[paras[i].split("=")[0]]= paras[i].split("=")[1] ;
		}
		var type=parasObj['type'];
		var seriesData=getData(type);
    	var categories=[];
    	var seriesName='双色球';
    	if(type==1){    		
    		for(var i=1;i<=33;i++){
    			categories.push(i);
    		}
    		for(var i=1;i<=16;i++){
    			categories.push(i);    			
    		}
    	}else if(type==2){
    		seriesName='大乐透';
    		for(var i=1;i<=35;i++){
    			categories.push(i);
    		}
    		for(var i=1;i<=12;i++){
    			categories.push(i);    			
    		}
    	}
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'column'
            },
            title: {
                text: ''
            },
            subtitle: {
                text: ''
            },
            xAxis: {
                categories: categories
            },
            yAxis: {
                min: 0,
                title: {
                    text: ''
                }
            },
            legend: {
                layout: 'vertical',
                backgroundColor: '#FFFFFF',
                align: 'left',
                verticalAlign: 'top',
                x: 100,
                y: 70,
                floating: true,
                shadow: true
            },
            tooltip: {
                formatter: function() {
                    return ''+
                        this.x +': '+ this.y +' mm';
                }
            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
                series: [{
                name: seriesName,
                data:seriesData    
            }]
        });
    });
    
});
		</script>
  </head>
  
  <body>
  	<div><a href="lottery/lottery.jsp">返回</a></div>
    <div>
    <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </div> <br>
  </body>
</html>
